<template>
	<view class="about">
		<uv-navbar title="设置" autoBack placeholder bgColor="linear-gradient(to bottom, #EAA8AD, #F4D1D1)" />
		
		<view class="content">
			<uv-cell-group :border="false" v-if="isPwd" class="pass-word-box">
				<uv-cell title="原密码">
					<template #value>
						<uv-input border="none" inputAlign="left" placeholder="请输入原始密码" v-model="passModel.password" />
					</template>
				</uv-cell>
				<uv-cell title="新密码">
					<template #value>
						<uv-input border="none" inputAlign="left" placeholder="请输入新密码" v-model="passModel.new_password" />
					</template>
				</uv-cell>
				<uv-cell title="确认密码">
					<template #value>
						<uv-input border="none" inputAlign="left" placeholder="请输入确认密码" v-model="passModel.confirm_password" />
					</template>
				</uv-cell>
			</uv-cell-group>
			
			<uv-cell-group :border="false" v-else>
				<uv-cell title="修改资料" isLink  @click="goUrl('/pages-user/info')"/>
				<uv-cell title="修改密码" isLink  @click="handUnPassWord"/>
				<uv-cell title="实人认证" isLink  @click="goUrl('/pages-user/real_name_auth/real_name_auth')"/>
				<uv-cell title="设置支付密码" isLink @click="goUrl('/pages-user/payment_password')"/>
				<uv-cell title="谁可以看我的发布" isLink @click="open(1)">
					<template #value>
						<uv-text :text="purviewType1Txt" size="28rpx" color="#333" align="right" />
					</template>
				</uv-cell>
				<uv-cell title="谁可以看我的回复" isLink @click="open(2)">
					<template #value>
						<uv-text :text="purviewType2Txt" size="28rpx" color="#333" align="right" />
					</template>
				</uv-cell>
				<uv-cell title="检查新版本" isLink />
				<uv-cell title="注销账号" isLink />
			</uv-cell-group>
		</view>
		
		<view class="content1">
			
			<uv-button text="提交" shape="circle" color="#CC2B24" v-if="isPwd" @click="onUnPassWord" />
			<uv-button text="退出登录" shape="circle" color="#CC2B24" plain @click="logout" v-else/>
		</view>
		
		<uv-picker ref="pickerRef" :columns="columns" @confirm="confirm" confirmColor="#CC2B24" />
	</view>
</template>

<script setup>
	import { ref,reactive,computed,onMounted } from 'vue';
	import { useUserStore } from '@/store'
	import { onBackPress } from '@dcloudio/uni-app'
	import { changePassword,setInformationPurview } from '@/api'
	import { useCustomTabbarStore } from '@/store'
	const tabbarStore = useCustomTabbarStore()
	const columns = ref([['所有人', '关注我的', '我自己']])
	
	const passModel = reactive({password: '',new_password: '',confirm_password: ''})
	
	const user = useUserStore()
    const isPwd = ref(false)
	const pickerRef = ref(null)
	const phone = ref(user.userInfo.phone_number.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2'))
	const purviewType = ref('');
	const publishPurviewIndex = ref(user.userInfo.publish_purview - 1);
	const replyPurviewIndex = ref(user.userInfo.reply_purview - 1)
	const purviewType1Txt = ref(columns.value[0][publishPurviewIndex.value]);
	const purviewType2Txt =  ref(columns.value[0][replyPurviewIndex.value]);
	
	onMounted(() => {
		console.log('-----user.userInfo-----',user.userInfo)
	
	});
	
	const goUrl= (turl) =>{
		uni.navigateTo({
		  url: turl
		})
	}
	const confirm = (e) => {
		let postData={}
		console.log('----------e---------',e);//e.value[0]
		if(purviewType.value === 1){
			purviewType1Txt.value = e.value[0]
			publishPurviewIndex.value = e.indexs[0]*1
		}
		if(purviewType.value === 2){
			purviewType2Txt.value = e.value[0]
			replyPurviewIndex.value = e.indexs[0]*1
		}
		
		
		postData.purview_type = purviewType.value
		postData.purview_status= e.indexs[0]*1+1
		try {
		  const { result } = setInformationPurview(postData)
		  user.updateUserInfo({
			  publish_purview: publishPurviewIndex.value+1,
			  reply_purview: replyPurviewIndex.value+1
		  })
		  
		  
		  uni.$uv.toast('更新成功')
		} catch (error) {
		  uni.$uv.toast('更新失败')
		}
		
	}
	
	const open = (purview_type) =>{
		purviewType.value = purview_type
		let indexVal = purview_type == 1 ? publishPurviewIndex.value : replyPurviewIndex.value
		pickerRef.value.setIndexs([indexVal],true)
		pickerRef.value.open()
	} 
	const close = () => pickerRef.value.close()
	
	const logout = () => {
		uni.showModal({
			title: '提示',
			content: '确定要退出登录吗？',
			success: async function (res) {
				if (res.confirm) {
					await user.logout_init()
					tabbarStore.setCurrent(0)
					uni.reLaunch({ url: '/pages/home/index' })
				}
			}
		});
	}
	
	const handUnPassWord = ()=>{
		passModel.password=''
		passModel.new_password=''
		passModel.confirm_password=''
		isPwd.value = true
	}
	
	
	
	const onUnPassWord = () => {
		
		try {
			if(!passModel.password || !passModel.new_password || !passModel.confirm_password){
				uni.$uv.toast('信息不完整')
				return false
			}
			
			if(passModel.password == passModel.new_password){
				uni.$uv.toast('新密码不可与旧密码相同')
				return false
			}
			
			if(passModel.new_password != passModel.confirm_password){
				uni.$uv.toast('新密码两次输入不一致')
				return false
			}
		  const { result } = changePassword(passModel)
		  
		  uni.$uv.toast('修改密码成功')
		  isPwd.value = false
		} catch (error) {
		  uni.$uv.toast('修改密码失败')
		}
	}
	
	onBackPress(() => {
		if(isPwd.value) {
			isPwd.value = false
			return true
		}
	})
</script>

<style>
	page {
		background-color: #F6F4F7;
	}
</style>

<style lang="scss" scoped>
	.pass-word-box{
		.uv-cell{
			  :deep(.uv-cell__body__content) {
			   display: block !important;
			   width: 200rpx;
			   flex:none;
			  }
		}
		
	}
	
	
	.about{
		:deep(.uv-status-bar){
			background-image: none !important;
			background-color: #EAA8AD !important;
		}
		.content {
			background-color: #FFFFFF;
		}
		.content1 {
			margin: 0 40rpx;
			margin-top: 100rpx;
		}
	}
</style>